<!DOCTYPE html>
<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>    
    <link rel="stylesheet" href="./css/style.css">
	<body style="">
	<div class="page-header clearfix">
        <div class="middle-nav">
          <div class="middlenav-wrap clearfix">
            <h1 class="logo fl">
              <a href="/front/goods.html" title="FStack"><img src="./images/logo.png" alt="FStack"></a>
            </h1>
			<div class="desire fl">
              <span id="memberName" style="font-size:16px;">欢迎您,</span>
              <a href="/front/order_list.html" class="ca-lightgrey" rel="nofollow"><span>我的订单</span></a>
              <a href="/front/order_detail.html" class="ca-lightgrey" rel="nofollow"><span>我的购物车</span></a>
            </div>
          </div>
        </div>
      </div>
	<!-- 购物车部分 start -chay -->
    <div class="shopping-cart clearfix" data-status="1" data-poiname="" data-poiid="144928553110415497">
	    <form method="post" action="" id="shoppingCartForm">
  	    <div class="order-list" style="top: -100px;">
  	      <div class="title">
            <span class="fl buy-title">购物车</span>
  	        <span class="fr dishes"><a id="cleanBuyCar" href="javascript:;" class="clear-cart"><i></i>清空菜品</a></span>
  	      </div>
  	      <ul id="buycar" style="height: auto; overflow: visible;">
			</ul>
  	      <!-- <div class="other-charge">
  	        <div class="clearfix packing-cost">
  	          <span class="fl">包装盒</span>
  	          <span class="fr boxtotalprice">¥1</span>
  	        </div>
  	        <div class="clearfix delivery-cost">
  	          <span class="fl">配送费(不计入起送价)</span>
  	          <span class="fr shippingfee">¥6</span>
  	        </div>
  	      </div> -->
  	      <div class="privilege hidden" style="">
  	      </div>
  	      <div class="total">共<span class="totalCount" id="totalCount">0</span>份，总计<span class="bill" id="totalPrice">0</span></div>
  	    </div>

  	    <div class="buycarfooter footer clearfix">
          <div class="logo icon fl"></div>
          <div class="fr">
            <input class="go-pay borderradius-2" id="goods_order" type="button" value="立即下单" style="display: inline-block;">
            <input type="hidden" value="{&quot;poi&quot;:&quot;144928553110415497&quot;,&quot;foods&quot;:[{&quot;sku&quot;:119600112,&quot;attrs&quot;:[],&quot;num&quot;:1}]}" class="order-data" name="shop_cart">
          </div>
        </div>
      </form>
    </div>
	<!-- 购物车部分 end -chay -->
	  <div class="wrapper">
  	  
      <div class="page-wrap">
        <div class="inner-wrap">
<div class="food-list fl">

  <div class="cate-tab-area">
  <div class="tab-link">
    <div class="tab-link-inner clearfix">
      <a href="" class="tab-item  active">菜单</a>
      <!-- <a href="" class="tab-item ">评价</a> -->
    </div>
  </div>
	<!-- 菜单类目 start -chay -->
    <div class="ori-foodtype-nav clearfix">
      <ul id="goodsType" class="clearfix">
        
      </ul>
    </div>
	<!-- 菜单类目 end -chay -->
  </div>

  <div class="food-nav">
      
  </div>
</div>


<div class="widgets fr">
</div><div class="clear"></div>

      </div>
    </div>
  </div>
  
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="../lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="../lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="../static/h-ui/js/H-ui.min.js"></script> 
<script type="text/javascript" src="../static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->
<script type="text/javascript" src="../static/h-ui.admin/js/common.js"></script>
<script type="text/javascript" src="../static/h-ui.admin/js/utils.js"></script>
<script type="text/javascript">
$(function(){
	
	//页面内跳转实现
	$(document).on("click",".menuType",function(){  
		var val = $(this).attr("data-anchor");
		scrollOffset($(".title-"+val).offset()); 
	});
	function scrollOffset(scroll_offset) {
		$("body,html").animate({
		  scrollTop: scroll_offset.top - 70
		}, 0);
	}
	//加入购物车
	$(document).on("click",".add",function(){
		var divs = $(this).parent().parent();
		var id = divs.attr("id");
		var name = divs.find(".name").html();
		var goodsPrice = divs.find(".goods_price").html();
		
		loadBuycarHtml(id,name,goodsPrice);
		buycarCountPrice();
		//totalnumber\\bill
		//var totalCount = $("#totalCount").html();
		//var totalPrice = $("#totalPrice").html();
		//$("#totalCount").html(parseInt(totalCount)+1);
		//$("#totalPrice").html(parseFloat(totalPrice)+parseFloat(goodsPrice));
	});
	//加载购物车商品详情
	function loadBuycarHtml(id,name,goodsPrice){
		var li = $("#buycar_goods"+id);
		if(li.length>0){
			var count = li.find(".txt-count").val();
			li.find(".txt-count").val(parseInt(count)+1);
		}else{
			buycarStyle();
			var html='<li class="clearfix buycar_goods" data-fid="" id="buycar_goods'+id+'" attrId="'+id+'" data-fkey="">\
						<div class="fl na clearfix" title="'+name+'">\
							<div class="goodsName">'+name+'</div>\
						</div>\
						<div class="fl modify clearfix">\
							<a href="javascript:;" class="fl minus">-</a>\
							<input type="text" class="fl txt-count" value="1 " maxlength="2">\
							<a href="javascript:;" class="fl plus">+</a>\
						</div>\
						<div class="fr pri "><span>¥<span class="goodsPrice">'+goodsPrice+'</span> </span>  </div>\
					</li>';
			$("#buycar").append(html);
		}
	}
	//购物车样式
	function buycarStyle(){
		var h = $("#buycar").height();
		if(parseInt(h)>=250){
			$("#buycar").height(250);
			$("#buycar").css("overflow-y","scroll");
			$("#buycar").css("overflow-x","hidden");
		}else{
			$(".shopping-cart").height($("#buycar").height()+100);
			var mtVal = $(".buycarfooter").css("margin-top").replace("px","");
			$(".buycarfooter").css("margin-top",$("#buycar").height()+parseInt(50));
		}
		//$(".shopping-cart").height($("#buycar").height()+100);
		//var mtVal = $(".buycarfooter").css("margin-top").replace("px","");
		//$(".buycarfooter").css("margin-top",parseInt(mtVal)+parseInt(50));
	}
	//减购物车的商品
	$(document).on("click",".minus",function(){
		var countInput = $(this).siblings(".txt-count");
		var v = parseInt(countInput.val())-1;
		if(v<=0){
			buycarStyle();
			countInput.parent().parent().remove();
			$("#totalCount").html(0);
			$("#totalPrice").html(0);	
		}else{
			countInput.val(v);
		}
		buycarCountPrice();
	});
	//加购物车的商品
	$(document).on("click",".plus",function(){
		var countInput = $(this).siblings(".txt-count");
		var v = parseInt(countInput.val())+1;
		countInput.val(v);
		buycarCountPrice();
	});
	//统计购物车商品价格和数量
	function buycarCountPrice(){
		var lis = $("#buycar").find(".buycar_goods");
		var totalCount=0,totalPrice=0;
		$.each(lis, function(){
			var count = $(this).find(".txt-count").val();
			var price = $(this).find(".goodsPrice").html();
			totalCount+=parseInt(count);
			totalPrice = parseFloat(totalPrice+parseFloat(parseInt(count)*parseFloat(price)));
		});
		$("#totalCount").html(totalCount);
		$("#totalPrice").html(totalPrice);
	}
	//清空购物车
	$("#cleanBuyCar").click(function(){
		$("#totalCount").html(0);
		$("#totalPrice").html(0);		
		$("#buycar").css("overflow-y","hidden");
		$("#buycar").empty();
	});
	//加载数据
	loadData();
	function loadData(){
		$("#memberName").html($("#memberName").html()+common.currentMember.name);
	
		var url = "/goodsTemp/list?pageNum=-1";
		common.getData(url,function(data){
			var list = data.result.records;
			var optHtml = '';
			for(var i=0;i<list.length;i++){
				var obj = list[i];
				optHtml+='<li class="">\
							<a href="javascript:;" class="type menuType" data-anchor="'+obj.id+'" title="'+obj.name+'">\
								<span class="name">'+obj.name+'</span>\
							</a>\
						</li>';
				
				var urls = "/goods/list?pageNum=-1&tempId="+obj.id;
				common.getData(urls,function(data){
					var list = data.result.records;
					var html = '<div class="category">\
								<h3 class="title title-'+obj.id+'" title="'+obj.name+'"><span class="tag-na">'+obj.name+'</span></h3>\
								<div class="pic-food-cont clearfix">';
					for(var i=0;i<list.length;i++){
						var objs = list[i];
						html+='<div class="j-pic-food pic-food " id="'+objs.id+'">\
									<div class="avatar">\
										<img src="'+objs.extraData.imgPath+'" >\
									</div>\
									<div class="np clearfix">\
										<span class="name fl" title="'+objs.name+'">'+objs.name+'</span>\
									</div>\
									<div class="sale-info clearfix">\
										<div class="sold-count ct-lightgrey">\
											<span>月售 24份</span>\
										</div>\
										<div class="zan-count">\
										  赞 2\
										</div>\
									</div>\
									<div class="labels clearfix">\
										<a href="javascript:;" class="add fr icon i-addcart j-addcart"></a>\
										<div class="price fl">\
											<div class="only">¥<span class="goods_price">'+objs.price+'</span></div>\
										</div>\
									</div>\
								</div>';
					}
					html+='</div>\
						</div>';
					$(".food-nav").append(html);
				});
			}
			$("#goodsType").html(optHtml);
		});
	}
	//下单
	$("#goods_order").click(function(){
		var lis = $("#buycar").find(".buycar_goods");
		var totalCount=0,totalPrice=0;
		var list=[],obj={};
		$.each(lis, function(){
			obj={};
			obj["id"]=$(this).attr("attrId");
			obj["name"]=$(this).find(".goodsName").html();
			obj["price"]=$(this).find(".goodsPrice").html();
			obj["count"]=$(this).find(".txt-count").val();
			
			list.push(obj);
		});
		common.addParams({buycars:JSON.stringify(list)});
		window.location.href=common.htmlPath+"/front/order_detail.html";
	});
	
});
</script>
</body></html>